<!DOCTYPE html>
<!-- saved from url=(0046)http://www.tablesgenerator.com/markdown_tables -->
<html lang="en" class="translated-ltr">

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

		<title>Markdown表生成器 - TablesGenerator.com</title>
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<meta name="description" content="Easily create tables in extended Markdown format supported by Markdown Here and GFM.">
		<meta name="author" content="">
		<link rel="shortcut icon" href="http://www.tablesgenerator.com/static/img/favicon.png">
		<!--[if IE]>
    <meta http-equiv="X-UA-Compatible" content="IE=Edge" />
    <![endif]-->

		<!-- Le styles -->
		<link title="无题" media="all" href="css/combined.228.css" rel="stylesheet" type="text/css">

		<script type="text/javascript" async="" src="js/ga.js"></script>
		<script type="text/javascript" src="js/combined.base.228.js" data-manual=""></script>

		<link type="text/css" rel="stylesheet" charset="UTF-8" href="css/translateelement.css">
	</head>

	<body cz-shortcut-listen="true">
		<div class="container">

			<div class="masthead">
				<div class="top-header">
					<h1 id="logo"><a href="http://www.tablesgenerator.com/" title="表生成器"><font><font>表生成器</font></font></a></h1>

				</div>

				<div class="navbar">
					<div class="navbar-inner">
						<div class="container">
							<ul class="nav">
								<li>
									<a href="html_tables.html" title="HTML表生成器">
										<font>
											<font>HTML表</font>
										</font>
									</a>
								</li>
								<li>
									<a href="text_tables.html" title="纯文本表生成器">
										<font>
											<font>文本表</font>
										</font>
									</a>
								</li>
								<li class="active">
									<a href="index.html" title="标记表发生器">
										<font>
											<font>标记表</font>
										</font>
									</a>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<!-- /.navbar -->

				<div class="ad-wrapper ad-banner">

					<script async="" src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
					<!-- 728_90_banner_tg -->
					<ins class="adsbygoogle" style="display:inline-block;width:728px;height:90px" data-ad-client="ca-pub-2865581676256868" data-ad-slot="2626492034"></ins>
					<script>
						(adsbygoogle = window.adsbygoogle || []).push({});
					</script>

				</div>

			</div>

			<div id="main-header">
				<h2>
<em><font><font>标记</font></font></em><font><font>表生成器
</font></font></h2>

				<ul class="social-likes social-likes_visible social-likes_ready">
					<li class="social-likes__widget social-likes__widget_facebook" title="在Facebook上分享链接"><span class="social-likes__button social-likes__button_facebook"><span class="social-likes__icon social-likes__icon_facebook"></span>
						<font>
							<font>Facebook </font>
						</font>
						</span><span class="social-likes__counter social-likes__counter_facebook"><font><font>276</font></font></span></li>
					<li class="social-likes__widget social-likes__widget_twitter" title="在Twitter上分享链接"><span class="social-likes__button social-likes__button_twitter"><span class="social-likes__icon social-likes__icon_twitter"></span>
						<font>
							<font>推特</font>
						</font>
						</span>
					</li>
				</ul>

			</div>

			<div id="main-block" class="main-block-v1">
				<div class="main-menu">

					<ul class="nav nav-pills">
						<li class="dropdown">
							<!-- File item -->
							<a class="dropdown-toggle" id="file_item" role="button" data-toggle="dropdown" href="">
								<font>
									<font>文件 </font>
								</font><b class="caret"></b></a>
							<ul id="menu3" class="dropdown-menu" role="menu" aria-labelledby="file_item">

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="new_table_item" data-toggle="modal" data-target="#new_table_dialog">
										<font>
											<font>新表...</font>
										</font>
									</a>
								</li>

								<li role="presentation" class="divider"></li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="import_csv_item" data-toggle="modal" data-target="#import_dialog">
										<font>
											<font>导入CSV文件...</font>
										</font>
									</a>
								</li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="import_pasted_item" data-toggle="modal" data-target="#import_pasted_dialog">
										<font>
											<font>粘贴表格数据...</font>
										</font>
									</a>
								</li>

								<li role="presentation" class="divider"></li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="save_table_item" data-toggle="modal" data-target="#save_table_dialog">
										<font>
											<font>保存表...</font>
										</font>
									</a>
								</li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="load_table_item" data-toggle="modal" data-target="#load_table_dialog">
										<font>
											<font>加载表...</font>
										</font>
									</a>
								</li>

							</ul>
						</li>
						<!-- File item -->
						<li class="dropdown">
							<a class="dropdown-toggle" id="column-dropdown" role="button" data-toggle="dropdown" href="">
								<font>
									<font>编辑 </font>
								</font><b class="caret"></b></a>
							<ul class="dropdown-menu" role="menu" aria-labelledby="column-dropdown">

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="edit_undo"><i class="icon-fixed-width icon-rotate-left"></i>
										<font>
											<font> 撤消（Ctrl + Z）</font>
										</font>
									</a>
								</li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="edit_redo"><i class="icon-fixed-width icon-rotate-right"></i>
										<font>
											<font> 重复（Ctrl + Y）</font>
										</font>
									</a>
								</li>

								<li role="presentation" class="divider"></li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="edit_autosave">
										<i class="icon-fixed-width icon-check"></i>
										<font>
											<font> 本地自动保存表</font>
										</font>
									</a>
								</li>
							</ul>
						</li>

						<li class="dropdown">
							<a class="dropdown-toggle" id="menu_table" role="button" data-toggle="dropdown" href="">
								<font>
									<font>表 </font>
								</font><b class="caret"></b></a>
							<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="drop_table">
								<li role="presentation" class="dropdown-submenu">
									<a role="menuitem" tabindex="-1" href="" id="table_resize">
										<font>
											<font>设置大小</font>
										</font>
									</a>
									<ul class="dropdown-menu">
										<li>
											<div class="table_size_chooser">
												<div class="SizeChooser">
													<table>
														<tbody>
															<tr>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td class="SizeChooser-selected"> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
															<tr>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
																<td> </td>
															</tr>
														</tbody>
													</table>
													<form><input><span><font><font> X </font></font></span><input></form>
												</div>
											</div>
										</li>
									</ul>
								</li>
								<li role="presentation" class="divider"></li>
								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="table_reset">
										<font>
											<font>清除表</font>
										</font>
									</a>
								</li>
							</ul>
						</li>

						<li class="dropdown">
							<a class="dropdown-toggle" id="column-dropdown" role="button" data-toggle="dropdown" href="">
								<font>
									<font>柱 </font>
								</font><b class="caret"></b></a>
							<ul id="menu1" class="dropdown-menu" role="menu" aria-labelledby="column-dropdown">
								<li class="dropdown-submenu">
									<a href="" tabindex="-1">
										<font>
											<font>文本对齐</font>
										</font>
									</a>
									<ul class="dropdown-menu">
										<li>
											<a href="" tabindex="-1" class="marked" id="col_align_left">
												<i class="icon-fixed-width icon-align-left"></i>
												<font>
													<font> 剩下</font>
												</font>
											</a>
										</li>
										<li>
											<a href="" tabindex="-1" id="col_align_center">
												<i class="icon-fixed-width icon-align-center"></i>
												<font>
													<font> 中央</font>
												</font>
											</a>
										</li>
										<li>
											<a href="" tabindex="-1" id="col_align_right">
												<i class="icon-fixed-width icon-align-right"></i>
												<font>
													<font> 对</font>
												</font>
											</a>
										</li>
									</ul>
								</li>

								<li role="presentation" class="divider"></li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="col_insert_left"><i class="icon-fixed-width icon-arrow-left"></i>
										<font>
											<font> 向左插入</font>
										</font>
									</a>
								</li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="col_insert_right"><i class="icon-fixed-width icon-arrow-right"></i>
										<font>
											<font> 插入右边</font>
										</font>
									</a>
								</li>

								<li role="presentation" class="divider"></li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="col_remove"><i class="icon-fixed-width icon-trash"></i>
										<font>
											<font> 去掉</font>
										</font>
									</a>
								</li>
							</ul>
						</li>
						<li class="dropdown">
							<a class="dropdown-toggle" id="row-dropdown" role="button" data-toggle="dropdown" href="">
								<font>
									<font>行 </font>
								</font><b class="caret"></b></a>
							<ul id="menu2" class="dropdown-menu" role="menu" aria-labelledby="row-dropdown">
								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="row_insert_above"><i class="icon-fixed-width icon-arrow-up"></i>
										<font>
											<font> 插入上面</font>
										</font>
									</a>
								</li>
								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="row_insert_below"><i class="icon-fixed-width icon-arrow-down"></i>
										<font>
											<font> 插入下面</font>
										</font>
									</a>
								</li>
								<li role="presentation" class="divider"></li>
								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="row_remove"><i class="icon-fixed-width icon-trash"></i>
										<font>
											<font> 去掉</font>
										</font>
									</a>
								</li>
							</ul>
						</li>

						<li class="dropdown">
							<!-- Help menu -->
							<a class="dropdown-toggle" id="file_item" role="button" data-toggle="dropdown" href="">
								<font>
									<font>帮帮我 </font>
								</font><b class="caret"></b></a>
							<ul class="dropdown-menu" role="menu" aria-labelledby="file_item">
								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="" id="show_help_item" data-toggle="modal" data-target="#quick_help_dialog">
										<font>
											<font>快速帮助</font>
										</font>
									</a>
								</li>

								<li role="presentation">
									<a role="menuitem" tabindex="-1" href="http://www.tablesgenerator.com/changelog">
										<font>
											<font>更新日志</font>
										</font>
									</a>
								</li>
							</ul>
						</li>
						<!-- Help menu -->

						<li style="float: right;">
							<a role="button" href="" style="color: #F02311;" id="show_example_btn">
								<font>
									<font>显示示例 </font>
								</font>
							</a>
						</li>
					</ul>

				</div>

				<div class="btn-toolbar" style="margin: 0;">

					<div class="btn-group">
						<a class="btn" title="设置所选单元格的左文本对齐" id="left_align_btn"><i class="toolbar-icon icon-align-left"></i></a>
						<a class="btn" title="为所选单元格设置中心文本对齐" id="center_align_btn"><i class="toolbar-icon icon-align-center"></i></a>
						<a class="btn" title="为所选单元格设置正确的文本对齐" id="right_align_btn"><i class="toolbar-icon icon-align-right"></i></a>
					</div>

				</div>

				<div id="edited_table_container">
					<table class="tableview" tabindex="1" cellspacing="3" data-target="#table-cell-menu">

					</table>
				</div>

				<div id="generate_table_panel">
				</div>
				<div id="result-box">
					<div class="note"><strong><font><font>结果</font></font></strong> <span class="muted"><font><font>（点击“生成”刷新）</font></font></span></div>
					<div class="btn copy-to-clipboard-workaround" style="float: right; display: block;">
						<i class="icon-paste"></i>
						<font>
							<font> 复制到剪贴板
							</font>
						</font>
					</div>
					<div class="btn with-zero-clipboard" id="copy-to-clipboard" data-action-id="copy-to-clipboard" style="display: none;"><i class="icon-paste"></i>
						<font>
							<font> 复制到剪贴板</font>
						</font>
					</div>
					<div class="clearfix"></div>
				</div>

				<pre class="line-numbers language-markdown" title="双击选择全部"><code class=" language-markdown" id="result-code">|  Shopping List |        |           |        |           |        |<font></font>
|:--------------:|--------|-----------|--------|-----------|--------|<font></font>
| Bread &amp; Butter | Pie    | Buns      | Danish | Croissant |        |<font></font>
|                | Cheese | Ice cream |        | Butter    | Yogurt |<span class="line-numbers-rows"><span></span><span></span><span></span><span></span></span></code></pre>

				<p>
					<font>
						<font>
							您现在可以直接使用</font>
					</font><strong><font><font>文件/粘贴表数据...</font></font></strong>
					<font>
						<font>对话框</font>
						<font>导入Markdown表代码</font>
						<font>。
						</font>
					</font>
				</p>

			</div>

			<div id="bottom-block">

				<div class="main-bottom">

					<div class="span6">

						<h3><font><font>如何使用它？</font></font></h3>

						<ol>
							<li>
								<font>
									<font>使用</font>
								</font><em><font><font>表格</font></font></em>
								<font>
									<font>菜单设置所需的表格大小。</font>
								</font>
							</li>
							<li>
								<font>
									<font>在表格中输入表格数据：
									</font>
								</font>
								<ul>
									<li>select and copy (Ctrl+C) a table from the spreadsheet (e.g. Google Docs, LibreOffice Calc, webpage) and paste it into our editor -- click a cell and press Ctrl+V</li>
									<li>or just <strong>double click any cell</strong> to start editing it's contents -- Tab and Arrow keys can be used to navigate table cells</li>
								</ul>
							</li>
							<li>Adjust text alignment and table borders using the options from the menu and using the toolbar buttons -- formatting is applied to all the selected cells.</li>
							<li>Click "Generate" button to see the generated table -- select it and copy to your document.</li>
						</ol>

						<h3>Markdown tables support</h3>
						<p>
							As the official
							<a href="http://daringfireball.net/projects/markdown/syntax" title="Markdown语法文档">Markdown documentation</a>
							states, Markdown does not provide any special syntax for tables. Instead it uses HTML &lt;table&gt; syntax. But there exist Markdown syntax extensions which provide additional syntax for creating simple tables.
						</p>

						<p>
							One of the most popular is
							<a href="http://markdown-here.com/" title="马尔福在这里">Markdown Here</a> — an extension for popular browsers which allows you to easily prepare good-looking e-mails using Markdown syntax.
						</p>

						<p>
							Similar table syntax is used in the <em>Github Flavored Markdown</em>, in short GFM tables.
						</p>

					</div>
					<!--span6-->

					<div class="span6">

						<h3>Example</h3>

						<p>
							<font>
								<font>
									GFM Markdown表的语法很简单。</font>
								<font>它不允许行或单元格跨越以及在单元格中放置多行文本。</font>
								<font>第一行始终是标题，后跟一个额外的行，带有破折号“ - ”和可选冒号“：”用于强制列对齐。
								</font>
							</font>
						</p>
						<pre><font><font>| </font><font>表| </font><font>是| </font><font>酷|</font></font><font></font><font><font>
| ---------- |：-------------：| ------：|</font></font><font></font><font><font>
| </font><font>col 1是| </font><font>左对齐| </font><font>$ 1600 |</font></font><font></font><font><font>
| </font><font>col 2是| </font><font>中心| </font><font>$ 12 |</font></font><font></font><font><font>
| </font><font>col 3是| </font><font>右对齐| </font><font>$ 1 |</font></font><font></font>
    </pre>

					</div>
					<!--span6-->

				</div>
			</div>

			<div id="footer">
				<hr>
				<p>
					<font>
						<font>
							©TablesGenerator.com

						</font>
					</font>
					<a href="http://www.tablesgenerator.com/about" style="margin-left: 20px; float: right;" title="了解更多关于表生成器">
						<font>
							<font>关于</font>
						</font>
					</a>
					<a href="http://www.tablesgenerator.com/changelog" style="float: right;" title="阅读我们的应用程序的最近更改">
						<font>
							<font>Changelog</font>
						</font>
					</a>
				</p>

			</div>

		</div>
		<!-- /container -->

		<div id="message_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="message_dialog_label" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><font><font>×</font></font></button>
				<h3 id="message_dialog_label"><font><font>通知</font></font></h3>
			</div>
			<div class="modal-body">
				<p id="message_dialog_body"></p>
			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true"><font><font>关</font></font></button>
			</div>
		</div>
		<div id="new_table_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><font><font>×</font></font></button>
				<h3 id="myModalLabel"><font><font>创建新表</font></font></h3>
			</div>

			<form class="form-horizontal">
				<div class="modal-body">
					<p>
						<font>
							<font>
								输入表格大小。</font>
							<font>请记住，当前的表格内容将会丢失。
							</font>
						</font>
					</p>

					<div class="control-group">
						<label class="control-label" for="new_table_rows"><font><font>行</font></font></label>
						<div class="controls">
							<input type="number" min="1" max="500" id="new_table_rows_input" value="3">
							<span class="help-inline"><font><font>有效范围：1-500</font></font></span>
						</div>
					</div>
					<div class="control-group">
						<label class="control-label" for="new_table_columns"><font><font>列</font></font></label>
						<div class="controls">
							<input type="number" min="1" max="20" id="new_table_columns_input" value="3">
							<span class="help-inline"><font><font>有效范围：1-20</font></font></span>
						</div>
					</div>

				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true"><font><font>取消</font></font></button>
					<font>
						<font><input type="submit" id="create_new_table_btn" value="创建" class="btn btn-primary"></font>
					</font>
				</div>
			</form>
		</div>
		<!-- Import dialog -->
		<div id="import_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true"><font><font>×</font></font></button>
				<h3 id="myModalLabel">Import data from CSV file</h3>
			</div>
			<form action="http://www.tablesgenerator.com/markdown_tables" enctype="multipart/form-data" method="post" style="margin: 0;">
				<div class="modal-body">
					<p>You can import table data by uploading file in CSV format (Comma Separated Value). Most spreadsheet software, both desktop and online, allows to save tabular data in CSV format — it is usually available in the File menu under the name "Save As..." or "Export".
					</p>
					<div>
						<label style="display: inline-block;">Select CVS file </label>
						<input type="file" name="imported">
					</div>
					<p class="text-info" style="padding-top: 10px;">
						Please, ensure that the character encoding of your CSV file was set to UTF-8 otherwise some of the characters may be displayed incorrectly.
					</p>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
					<input type="submit" value="Import" class="btn btn-primary">
				</div>
			</form>
		</div>
		<!-- Import dialog -->
		<!-- Import dialog -->
		<div id="import_pasted_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel">Paste table data</h3>
			</div>
			<form action="http://www.tablesgenerator.com/markdown_tables" method="post" accept-charset="UTF-8" style="margin: 0;">
				<div class="modal-body">
					<p>
						Paste (Ctrl + V) below an existing table data copied (Ctrl + C) from a spreadsheet (e.g. Microsoft Excel), a text document, a Markdown code, or even a website.
					</p>
					<div>
						<textarea id="import_pasted" name="import_pasted" cols="80" rows="10" accept-charset="utf-8"></textarea>
					</div>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
					<input type="submit" value="Load" class="btn btn-primary">
				</div>
			</form>
		</div>
		<!-- Import dialog -->
		<div id="save_table_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel">Save table</h3>
			</div>

			<div class="modal-body">
				<p>
					If you want to keep the table for any future editing click the "Download" button below. The file with the table can be loaded back using the "Load table" option from the menu.
				</p>

				<form id="table-save-form" action="http://www.tablesgenerator.com/table-save" method="POST" accept-charset="utf-8" class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="table-name">Table name</label>
						<div class="controls">
							<input type="text" id="table-name" name="table-name" placeholder="Enter name...">
						</div>
					</div>
					<div class="control-group">
						<div class="controls">
							<a href="" class="btn btn-primary" id="table-save-link" title="Click to download file with the table">Download</a>
						</div>
					</div>
					<input name="table-data" id="table-save-data" type="hidden">
				</form>

				<p>
				</p>
			</div>

			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
			</div>
		</div>
		<!-- Import dialog -->
		<!-- Load table dialog -->
		<div id="load_table_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="load_table_dialog_label" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="load_table_dialog_label">Load table...</h3>
			</div>
			<form action="http://www.tablesgenerator.com/markdown_tables/load" enctype="multipart/form-data" method="post" style="margin: 0;">
				<div class="modal-body">
					<p>Load table from a previously saved file.</p>
					<div>
						<label style="display: inline-block;">Select TGN file </label>
						<input type="file" name="load_table_file">
					</div>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
					<input type="submit" value="Load" class="btn btn-primary">
				</div>
			</form>
		</div>
		<!-- Import dialog -->

		<div id="quick_help_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="quick_help_dialog_label" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="quick_help_dialog_label">Quick help</h3>
			</div>

			<div class="modal-body">
				<p>Basic key commands</p>
				<ul>
					<li><strong>ENTER or double click</strong> — to start editing a cell</li>
					<li><strong>ESC</strong> — to stop editing a cell</li>
					<li><strong>TAB or Arrow Keys</strong> — to select a different cell</li>
					<li><strong>CTRL+Z</strong> — to undo a change</li>
					<li><strong>CTRL+Y</strong> — to redo a change</li>
					<li><strong>Left mouse button</strong> — click a cell to select it (hold left button pressed to select adjacent cells)</li>
					<li><strong>Hold CTRL</strong> to select multiple cells (not necessarily adjacent).</li>
				</ul>

				<p>
					Some of the functionalities may not work in all browsers — if you encounter a problem, please try to use another browser (Google Chrome, Mozilla Firefox) or update your browser to a newer version if available. If the problem still persists please
					<a href="http://www.tablesgenerator.com/contact" title="Contact with us">let us know</a>.
				</p>
			</div>

			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">Close</button>
			</div>
		</div>
		<div id="table-aux-col-menu" class="context-menu-wrap">
			<ul class="context-menu" role="menu">
				<li data-menu-item-id="add_to_the_left">
					<a tab-index="-1">Add column to the left</a>
				</li>

				<li data-menu-item-id="add_to_the_right">
					<a tab-index="-1">Add column to the right</a>
				</li>

				<li data-menu-item-id="remove_column">
					<a tab-index="-1">Remove column(s)</a>
				</li>

			</ul>
		</div>

		<div id="table-aux-row-menu" class="context-menu-wrap">
			<ul class="context-menu" role="menu">
				<li data-menu-item-id="add_row_above">
					<a tab-index="-1">Add row above</a>
				</li>

				<li data-menu-item-id="add_row_below">
					<a tab-index="-1">Add row below</a>
				</li>

				<li data-menu-item-id="remove_row">
					<a tab-index="-1">Remove row(s)</a>
				</li>

			</ul>
		</div>

		<div id="table-cell-menu" class="context-menu-wrap">
			<ul class="context-menu" role="menu">

				<li data-menu-item-id="cell_contents_cut" class="with-zero-clipboard" data-action-id="cell_contents_cut">
					<a tab-index="-1">Cut</a>
				</li>

				<li data-menu-item-id="cell_contents_copy" class="with-zero-clipboard" data-action-id="cell_contents_copy">
					<a tab-index="-1">Copy</a>
				</li>

				<li class="divider"></li>

				<li class="dropdown-submenu">
					<a tabindex="-1" href="">Row</a>
					<ul class="dropdown-menu">
						<li data-menu-item-id="add_row_above">
							<a tab-index="-1">Add row above</a>
						</li>

						<li data-menu-item-id="add_row_below">
							<a tab-index="-1">Add row below</a>
						</li>

						<li data-menu-item-id="remove_row">
							<a tab-index="-1">Remove row(s)</a>
						</li>

					</ul>
				</li>

				<li class="dropdown-submenu">
					<a tabindex="-1" href="">Column</a>
					<ul class="dropdown-menu" role="menu">
						<li data-menu-item-id="add_to_the_left">
							<a tab-index="-1">Add column to the left</a>
						</li>

						<li data-menu-item-id="add_to_the_right">
							<a tab-index="-1">Add column to the right</a>
						</li>

						<li data-menu-item-id="remove_column">
							<a tab-index="-1">Remove column(s)</a>
						</li>
					</ul>
				</li>

			</ul>
		</div>

		<div id="column_width_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel">Set column width</h3>
			</div>

			<form class="form-horizontal">
				<div class="modal-body">
					<div class="control-group">
						<label class="control-label" for="column_width_input">Width</label>
						<div class="controls">
							<input type="number" min="1" max="2560" id="column_width_input" value="3">
							<span class="help-inline">px</span>
						</div>
					</div>
				</div>
				<div class="modal-footer">
					<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
					<input type="submit" id="set_column_width_btn" value="OK" class="btn btn-primary">
				</div>
			</form>
		</div>
		<div id="dropbox_save_table_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="myModalLabel">Save table to your Dropbox account</h3>
			</div>

			<div class="modal-body">
				<p>
					Your table will be saved using your Dropbox account. Please enter a name for the table. You can load later your saved tables using "File/Dropbox/Load table" menu item.
				</p>

				<form id="dropbox-table-save-form" accept-charset="utf-8" class="form-horizontal">
					<div class="control-group">
						<label class="control-label" for="table-name">Table name</label>
						<div class="controls">
							<input type="text" id="dropbox_table_name" name="dropbox_table_name" placeholder="Enter name...">
						</div>
					</div>
				</form>

				<p>
				</p>
			</div>

			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
				<button class="btn btn-primary" id="dropbox_table_save"><div class="spin-button"></div><span>Save</span></button>
			</div>
		</div>
		<div id="dropbox_load_table_dialog" class="modal hide fade" tabindex="-1" role="dialog" aria-labelledby="dropbox_load_table_dialog_label" aria-hidden="true">
			<div class="modal-header">
				<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
				<h3 id="dropbox_load_table_dialog_label">Load table from Dropbox...</h3>
			</div>
			<div class="modal-body">
				<p>Select a table to load.</p>
				<div id="dropbox_tables_list"></div>
			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
			</div>
		</div>
		<!--<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>-->
		<script type="text/javascript" charset="utf-8">
			$(document).ready(function() {
				init('#edited_table_container');
			});

			function show_result_code(code) {
				$('#result-code').text(code);
				Prism.highlightElement($('#result-code')[0]);
			}

			function init(parent_container) {
				var table = new TableModel();
				table.insertRow(['']);

				var tv = new TableView(table, parent_container);
				var ignore = {
					text_color: true,
					bg_color: true,
					font_style: true,
					fixed_layout: true,
					borders: true,
					colspan: true,
					rowspan: true,
					theme: true
				};
				tv.setLoadIgnore(ignore);
				tv.on('cell_created', function(cv) {
					cv.style.setBorders('lrtb');
				});
				table.resize(5, 5);
				table.removeRow(0);

				var main_ui = new MainUI(tv);

				$('<button class="btn"><i class="icon-cogs"></i> 生成</button>')
					.appendTo($('#generate_table_panel')).click(generate);

				var gen_opt_box = $('<div/>', { 'class': 'tab-gen-opt-box' })
					.appendTo($('#generate_table_panel'));

				var use_elastic_tabs = $('<input type="checkbox">');
				$('<label/>', { 'class': 'checkbox tab-gen-option' })
					.text('Put tabs between columns')
					.attr('title', 'Useful when your external editor supports elastic tabstops')
					.append(use_elastic_tabs)
					.appendTo(gen_opt_box)
					.change(generate);

				var compact_mode = $('<input type="checkbox">');
				$('<label/>', { 'class': 'checkbox tab-gen-option' })
					.text('Compact mode')
					.attr('title', 'Do not add extra spaces to align the cells')
					.append(compact_mode)
					.appendTo(gen_opt_box)
					.change(generate);

				function generate() {
					GlobalMessageHub.trigger(GlobalEvents.STOP_EDITING_TABLE);
					var output = MarkdownExport(tv,
						use_elastic_tabs.is(':checked'),
						compact_mode.is(':checked'));
					show_result_code(output);
				}

				$('#show_example_btn').click(function() {
					example(tv);
					generate();
				});

				generate();
			}

			function example(table_view) {
				table_view.reset();
				var model = table_view.model;
				var rows = [
					['Tables', 'Are', 'Cool'],
					['col 1 is', 'left-aligned', '$1600'],
					['col 2 is', 'centered', '$12'],
					['col 3 is', 'right-aligned', '$1']
				];

				model.setRows(rows);
				table_view.forEachCellViewInRange(function(cv) {
					cv.style.setHorizontalAlign('center');
				}, 0, 1, 3, 1);
				table_view.forEachCellViewInRange(function(cv) {
					cv.style.setHorizontalAlign('right');
				}, 0, 2, 3, 2);
			}
		</script>

		<div id="goog-gt-tt" class="skiptranslate" dir="ltr">
			<div style="padding: 8px;">
				<div>
					<div class="logo"><img src="./Markdown表生成器 - TablesGenerator.com_files/translate_24dp.png" width="20" height="20" alt="Google 翻译"></div>
				</div>
			</div>
			<div class="top" style="padding: 8px; float: left; width: 100%;">
				<h1 class="title gray">原文</h1></div>
			<div class="middle" style="padding: 8px;">
				<div class="original-text"></div>
			</div>
			<div class="bottom" style="padding: 8px;">
				<div class="activity-links"><span class="activity-link">提供更好的翻译建议</span><span class="activity-link"></span></div>
				<div class="started-activity-container">
					<hr style="color: #CCC; background-color: #CCC; height: 1px; border: none;">
					<div class="activity-root"></div>
				</div>
			</div>
			<div class="status-message" style="display: none;"></div>
		</div>
		<div class="goog-te-spinner-pos">
			<div class="goog-te-spinner-animation">
				<svg xmlns="http://www.w3.org/2000/svg" class="goog-te-spinner" width="96px" height="96px" viewBox="0 0 66 66">
					<circle class="goog-te-spinner-path" fill="none" stroke-width="6" stroke-linecap="round" cx="33" cy="33" r="30"></circle>
				</svg>
			</div>
		</div>
	</body>

</html>